<template>
  <div class="w-full h-full">
    <Nav></Nav>
    <Header />
    <SongList :list="SongList" />
  </div>
</template>

<script lang="ts">
import { ref, reactive, onMounted, watch, computed } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { useStore } from 'vuex'
import Nav from '@/components/common/nav.vue'
import Header from '@/components/common/header.vue'
import SongList from '@/components/common/songList.vue'
export default {
  name: '',
  setup() {
    const router = useRouter()
    const store = useStore()
    const SongList = computed(() => store.state.account.songsList)
    onMounted(() => {})
    return {
      SongList
    }
  },
  components: {
    Nav,
    Header,
    SongList
  }
}
</script>
<style scoped lang="scss"></style>
